import React, { Component } from 'react'
import PropTypes from 'prop-types'

export class Test extends Component {
  constructor(props) {
    super(props)
    this.state = {
      count: 1,
    }
  }

  incrementCountClick = () => {
    this.setState({
      count: this.state.count + 1,
    })
  }
  render() {
    return (
      <>
        <div>{this.state.count}</div>
        <button onClick={() => this.sonRef.decrementSonCount()}>在父组件中控制子组件减1</button>
        <hr />
        <TestSon ref={ref => (this.sonRef = ref)} incrementCount={() => this.incrementCountClick()}></TestSon>
      </>
    )
  }
}
export class TestSon extends Component {
  constructor(props) {
    super(props)
    this.state = {
      sonCount: 99,
    }
  }
  decrementSonCount = () => {
    this.setState({
      sonCount: this.state.sonCount - 1,
    })
  }
  render() {
    return (
      <>
        <div>{this.state.sonCount}</div>
        <button onClick={() => this.props.incrementCount()}>在子组件中控制父组件加1</button>
      </>
    )
  }
}
